<script setup lang="ts">
import { ref } from 'vue';
import Card from '../../components/Card.vue';

const name = ref("叶海")
const switchChecked = ref(true)
</script>

<template>
	<view class="p-3">
		<view class="flex items-center my-1">
			<image src="//img10.360buyimg.com/ling/jfs/t1/181258/24/10385/53029/60d04978Ef21f2d42/92baeb21f907cd24.jpg"
				class="rounded-full h-170 w-170 flex items-center justify-center" />
			<text class="ml-4">{{name}}</text>
		</view>
		<nut-cell class="text-30 my-4 px-2 bg-white flex items-center">
			<view class="w-full">
				<view>
					博雅读书: <text class="text-red">{{ 0 }}</text>
					博雅心情: <text class="text-red">{{ 3 }}</text>
					博雅实践: <text class="text-red">{{ 6.3 }}</text>
				</view>
				<view>
					博雅讲坛: <text class="text-red">{{ 1 }}</text>
					博雅修身: <text class="text-red">{{ 9 }}</text>
					博雅视野: <text class="text-red">{{ 4 }}</text>
				</view>
			</view>
			<nut-button type="primary" plain>
				详情
			</nut-button>
		</nut-cell>

		<view>
			<Card title="活动相关">
				<nut-cell title="正在参与的预约活动" is-link></nut-cell>
				<nut-cell title="未获得学分的预约活动" is-link></nut-cell>
			</Card>
			<Card title="导师相关">
				<nut-cell title="正在预约的导师" is-link></nut-cell>
				<nut-cell title="预约过的导师" is-link></nut-cell>
			</Card>
			<Card title="其他功能">
				<nut-cell title="消息推送">
					<template v-slot:link>
						<nut-switch v-model="switchChecked" />
					</template>
				</nut-cell>
				<nut-cell>
					清空缓存
				</nut-cell>
				<nut-cell>
					修改密码
				</nut-cell>
			</Card>
			<nut-button block type="primary">退出登录</nut-button>
		</view>
	</view>
</template>